import React from 'react'
// ===================================================================== Temp
import SubmitForm from '#cpt/temp/SubmitForm'
// ===================================================================== global declare
const { $fn, $Lazy, $http } = window
// ===================================================================== Lazy
const Page 		= $Lazy.load(()=>import('#tp/page/page-container'))
const $cache 	= $Lazy.file(()=>import('#private/cache-api'))
// ===================================================================== data
const width = '25%'
const typeData = [{name:'数字',value:'0'},{name:'字母',value:'1'}]
const prefixData = [
	{name:'年',value:'Y'},
	{name:'月',value:'M'},
	{name:'日',value:'D'},
	{name:'年月',value:'YM'},
	{name:'年日',value:'YD'},
	{name:'月日',value:'MD'},
	{name:'数值',value:'INT'}
]
// ===================================================================== component
class Index extends React.Component{
	state = {
		pag: {},
		// 提交表单列表
		formData : [
			{ label:'名称', 			name:'lab_name',				half:true, required:true },
			
			{ label:'动态前缀', 			name:'prefix_auto', 			half:true, title: '前缀配置', type:'select', data:prefixData, onValue:({ value, ref, formData })=>{
				$fn.hideRows(formData, ['prefix_int_start','prefix_int_end','prefix_int_inc'], value !== 'INT')
				ref.reset(['prefix_int_start', 'prefix_int_end', 'prefix_int_inc'])
				this.setState({ formData })
			}},
			
			{ label:'前缀起始值', 		name:'prefix_int_start',		width, type:'number', br:true },
			{ label:'前缀值结束值', 		name:'prefix_int_end',			width, type:'number' },
			{ label:'前缀值增量', 		name:'prefix_int_inc',			width, type:'number' },
			
			{ type:'cpt', component:<div className='tbor1 w mb20'></div> },
			
			{ label:'前缀位数', 			name:'lab_rule_start_type',		width, required:true, max:1, br:true, onValue:({ value, formData })=>{
				if(value){
					// 加急前缀
					$fn.getRow(formData,'critical_prefix').max = value
					// 编码前缀
					$fn.getRow(formData,'lab_rule_start').max = value
				}
				$fn.disabledRows(formData, ['critical_prefix','lab_rule_start'], !value)
				
				this.setState({ formData })
			}},
			
			{ label:'类型', 			name:'start_type', 				width, required:true, type:'select', data:typeData, onValue:({ value, ref, formData})=>{
				$fn.getRow(formData,'lab_rule_start').label = +value === 1 ? '前缀(字母)' : '前缀(数字)'
				$fn.getRow(formData,'critical_prefix').label = +value === 1 ? '加急前缀(字母)' : '加急前缀(数字)'
				ref.reset(['lab_rule_start', 'critical_prefix'])
				this.setState({ formData })
			} },
			{ label:'前缀', 			name:'lab_rule_start', 			required:true, width, max:1 },
			
			{ label:'后缀位数', 			name:'lab_rule_end_type',		width, required:true, max:1, br:true, onValue:({ value, formData })=>{
				if(value){
					// 起始值
					$fn.getRow(formData,'lab_rule_end').max = value
					// 加急起始值
					$fn.getRow(formData,'critical_start').max = value
				}
				$fn.disabledRows(formData, ['lab_rule_end','critical_start'], !value)
				
				this.setState({ formData })
			} },
			{ label:'起始值', 			name:'lab_rule_end',			width, required:true, max:1 },
			
			{ label:'加急前缀', 			name:'critical_prefix',			required:true, width, max:1, br:true },
			{ label:'加急起始值', 		name:'critical_start',			required:true, width, max:1 },
			
			
			{ label:'周期', 			name:'lab_cycle',				required:true, width, type:'select', loading:true,br:true, onValue:({ value, ref, formData })=>{
				$fn.hideRows(formData, ['cycle_start'], +value === 43901)
				$fn.hideRows(formData, ['cycle_start_time','cycle_end'], +value !== 43901)
				ref.reset(['cycle_start', 'cycle_start_time','cycle_end'])
				this.setState({ formData })
			} },
			{ label:'周期值', 			name:'cycle_start',				width },
			{ label:'开始时间', 			name:'cycle_start_time',		required:true, width, type:'time' },
			{ label:'结束时间', 			name:'cycle_end',				required:true, width, type:'time' },
			{ label:'描述', 			name:'description',				full:true, type:'textarea' },
		]
	}
	
	model = {}
	
	componentDidMount(){
		const { uuid } = $fn.query()
		if(uuid){
			this.uuid = uuid
			this.submit = { uuid }
		}
	}
	
	fetch = () => {
		const { formData } = this.state
		this.initSubmit = { prefix_int_start:0, prefix_int_end:0, prefix_int_inc:0  }
		if(this.uuid){
			const { uuid } = this
			this.submit = { uuid }
			$http.submit(this,'lis-lab-tag/info', { param: { uuid } }).then(data=>{
				const { prefix_auto, start_type, lab_cycle } = data
				// 动态前缀改变
				$fn.hideRows(formData, ['prefix_int_start','prefix_int_end','prefix_int_inc'], prefix_auto !== 'INT')
				// 类型改变
				$fn.getRow(formData,'lab_rule_start').label = +start_type === 1 ? '前缀(字母)' : '前缀(数字)'
				$fn.getRow(formData,'critical_prefix').label = +start_type === 1 ? '加急前缀(字母)' : '加急前缀(数字)'
				// 周期值改变
				$fn.hideRows(formData, ['cycle_start'], +lab_cycle === 43901)
				$fn.hideRows(formData, ['cycle_start_time','cycle_end'], +lab_cycle !== 43901)
				
				// 起始值
				$fn.getRow(formData,'lab_rule_end').max = data['lab_rule_end_type'] || 0
				// 加急起始值
				$fn.getRow(formData,'critical_start').max = data['lab_rule_end_type'] || 0
				
				
				// 加急前缀
				$fn.getRow(formData,'critical_prefix').max = data['lab_rule_start_type'] || 0
				// 编码前缀
				$fn.getRow(formData,'lab_rule_start').max = data['lab_rule_start_type'] || 0
				
				//
				this.setState({ formData }, ()=> this.formRef.setValue(data) )
			})
		}else{
			$fn.getRow(formData,'critical_prefix').label = '加急前缀'
			$fn.hideRows(formData, ['prefix_int_start','prefix_int_end','prefix_int_inc'], true)
			$fn.hideRows(formData, ['cycle_start_time','cycle_end','cycle_start'], true)
			this.setState({ formData })
		}
	}
	
	getSelect = async () => {
		const { formData } = this.state
		
		$cache.then( async f => {
			// 周期
			$fn.setRow( formData, 'lab_cycle', await f.getDisCache( { code:43900 } ))
			//
			this.setState({ formData }, this.fetch)
		})
	}

	render(){
		return (
			<Page title={`实验号模板-${this.uuid?'编辑':'设置规则'}`}>
				<div className='ex fv xplr pt10'>
					{ SubmitForm.call(this,{ labelWidth:'s11', msg:this.uuid?'编辑':'设置规则', api:this.uuid ? 'lis-lab-tag/edit' : 'lis-lab-tag/add', btnSize:'large', 
						scroll:true, hideButton:false, backRefresh : true,
						onForm: this.getSelect,
						onComplete:({ param })=>{$fn.dataClear()}
					}) }
				</div>
			</Page>
		)
	}
}

export default Index